import 'package:carousel_slider/carousel_slider.dart';
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:leader_help/utils/util.dart';

import '../index.dart';

class FirstSiteView extends GetView<HomeController> {
  const FirstSiteView({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Container(
      padding: EdgeInsets.all(10.r),
      margin: EdgeInsets.symmetric(horizontal: 10.r),
      decoration: BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.circular(10.r),
      ),
      child: Column(
        children: [
          CarouselSlider.builder(
            itemCount: controller.state.firstSiteList.length,
            itemBuilder: (ctx, index, realIndex) {
              var _item = controller.state.firstSiteList[index];
              return GestureDetector(
                onTap: () => controller.actionVideo(_item),
                child: Column(
                  crossAxisAlignment: CrossAxisAlignment.start,
                  children: [
                    Container(
                      alignment: Alignment.centerLeft,
                      height: 40.r,
                      child: Text(
                        _item.title,
                        style: pfMediumStyle(
                            color: ColorsUtil.title, fontSize: 15.sp),
                      ),
                    ),
                    Stack(
                      children: [
                        loadImage(
                          url: _item.picUrl,
                          fit: BoxFit.cover,
                          width: Get.width - 40.r,
                          height: 200.r,
                        ),
                        Positioned.fill(
                          child: Container(
                            alignment: Alignment.center,
                            child: Icon(
                              Icons.play_circle_fill,
                              size: 40.r,
                              color: Colors.white,
                            ),
                          ),
                        )
                      ],
                    ),
                  ],
                ),
              );
            },
            options: CarouselOptions(
              autoPlay: true,
              disableCenter: true,
              viewportFraction: 1,
              height: 250.r,
              // scrollDirection: Axis.vertical,
            ),
          ),
          Container(
            margin: EdgeInsets.only(top: 15.r),
            child: Row(
              mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: ['作指示', '面对面', '组建群']
                  .asMap()
                  .map((key, value) => MapEntry(
                      key,
                      InkWell(
                        child: Container(
                          alignment: Alignment.center,
                          width: 100.r,
                          height: 40.r,
                          decoration: BoxDecoration(
                            color: const Color(0xff0091CC),
                            borderRadius: BorderRadius.circular(5.r),
                          ),
                          child: Text(
                            value,
                            style: pfMediumStyle(
                                color: Colors.white, fontSize: 13.sp),
                          ),
                        ),
                      )))
                  .values
                  .toList(),
            ),
          ),
        ],
      ),
    );
  }
}
